<!DOCTYPE HTML>
<html>
<head>
    <link rel="stylesheet" href="../resources/default.css" />
    <style>
        table {
            border-spacing: 0px;
            background: red;
        }

        td {
            padding: 0px;
            border: 2px solid green;
        }
    </style>
    <script src="../resources/text-based-repaint.js"></script>
    <script>
        function repaintTest()
        {
            var cell = document.getElementById("cellToScroll");
            cell.scrollLeft = 1200;
        }
        window.addEventListener("load", runRepaintAndPixelTest, false);
    </script>
</head>
<body>
<!-- Bug 71550 - REGRESSION (r93614): Content remains despite parent element being scrolled off page using javascript. -->
<!-- For the test to pass you should not see any RED, only green -->
<table style="table-layout: fixed; width: 0">
    <tr class="red">
        <td class="green" style="height: 100px; width: 300px;"></td>
        <td class="green" style="height: 100px; width: 450px;"></td>
    </tr>
    <tr>
        <td style="overflow: hidden"><div class="green" style="height: 465px; width: 300px"></div></td>
        <td id="cellToScroll" class="relative" style="overflow: scroll;">
            <div class="relative red" style="height: 450px; width: 450px;"></div>
            <div class="absolute green" style="height: 450px; width: 450px; left: 500px; top: 0px"></div>
        </td>
    </tr>
</table>
</body>
</html>
